<!DOCTYPE HTML>
<html>
    <head>
        <meta charset="utf-8" />
        <title>账号登录-{eyou:global name='web_name' /}</title>
        <meta name="renderer" content="webkit">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
        <link href="{eyou:global name='web_cmspath' /}/favicon.ico" rel="shortcut icon" type="image/x-icon" />
        {eyou:static file="users/skin/css/basic.css" /}
        {eyou:static file="users/skin/css/eyoucms.css" /}
        {eyou:include file="users/skin/css/diy_css.htm" /}

        {eyou:static file="/public/static/common/js/jquery.min.js"/}
        {eyou:static file="/public/plugins/layer-v3.1.0/layer.js"/}
        {eyou:static file="users/skin/js/global.js" /}
    </head>

    <body class="reg login">
        <div class="register_index ey-member">
            <div class="container">
                
                    <div class="mip-reg-logo">
                        <a href="{eyou:global name='web_cmsurl' /}" class="ey-logo"><img src="{eyou:global name='web_logo'/}" /></a>
                    </div>
                    <div class="mip-reg-heading">
                        <div class="tab_list">
                            <ul>
                                <li data-index="0" class="current">账号登录</li>
                                <li data-index="1">手机登录</li>
                            </ul>
                        </div>
                    </div>
                    <div class="tab_con">
                        <div class="item" style="display: block;">
                            <form action="" name='theForm' id="theForm" method="post" class="form-register panel-body fv-form">
                                <div class="form-group">
                                    <input type="text" name="username" required class="form-control" placeholder="用户名" autocomplete="off" />
                                </div>
                                <div class="form-group">
                                    <input type="password" name="password" required class="form-control" placeholder="登录密码" autocomplete="off" />
                                </div>
                                {eyou:eq name="$is_vertify" value="1"}
                                <div class="form-group">
                                    <div class="input-group-icon">
                                        <div class="formText">
                                            <input type="text" name="vertify" autocomplete="off" class="form-control" placeholder="图片验证码" />
                                            <img src="{eyou:url link='api/Ajax/vertify' vars='type=users_login' /}" class="chicuele" id="imgVerifys" onclick="fleshVerify();" title="看不清？点击更换验证码" align="absmiddle">
                                        </div>
                                    </div>
                                </div>
                                {/eyou:eq}
                                <input type="hidden" name="referurl" value="{$referurl}" />
                                <input type="hidden" name="website" value="website" />
                                <input type="button" name="submit" class="btn btn-lg btn-primary btn-block" value="登录" />
                                <div class="login-link"> 
                                    <a href="{eyou:url link='user/Users/reg' /}">注册</a>
                                    <span>|</span> 
                                    <a href="{eyou:url link='user/Users/retrieve_password' /}">找回密码</a> 
                                </div>

                                <!-- 第三方账号登录 -->
                                {eyou:include file="/public/static/template/users_v2/users_loginapi_m.htm" /}
                                <!-- 第三方账号登录 -->
                            </form>
                        </div>
                        <div class="item">
                            <form action="" name='theMobileForm' id="theMobileForm" method="post" class="form-register panel-body fv-form">
                                <div class="form-group group_z">
                                    <input type="text" name="mobile" value="" required class="form-control" placeholder="请输入手机号" autocomplete="off" />
                                </div>
                                <div class="form-group group_z" style="display: none;" id="vertify_div">
                                    <div class="input-group-icon">
                                        <div class="formText">
                                            <input type="text" name="mobile_vertify" autocomplete="off" class="form-control" placeholder="图片验证码" />
                                            <img src="{eyou:url link='api/Ajax/vertify' vars='type=users_mobile_login' /}" class="chicuele" id="mobile_imgVerifys" onclick="mobile_fleshVerify();" title="看不清？点击更换验证码" align="absmiddle">
                                        </div>
                                    </div>
                                </div>
                                <div class="form-group group_z">
                                    <div class="input-group btn-direction">
                                        <div class="formText">
                                            <input type="text" class="form-control" id="mobile_code" name="mobile_code" placeholder="手机验证码">
                                        </div>
                                        <input type="button" id="mobile_code_button" onclick="send_mobile_code();" class="btn btn-primary sento" value="点击发送">
                                    </div>
                                </div>
                                <input type="hidden" name="referurl" value="{$referurl}" />
                                <input type="hidden" name="website" value="website" />
                                <input type="hidden" name="__mobile_1_token__" value="{$Request.token.__mobile_1_token__}" />
                                <input type="button" onclick="checkMobileUserLogin1649732103()" class="btn btn-lg btn-primary btn-block group_z" value="登录" />
                                <div class="login-link">
                                    <a href="{eyou:url link='user/Users/reg' /}">注册</a>
                                    <span>|</span> 
                                    <a href="{eyou:url link='user/Users/retrieve_password' /}">找回密码</a> 
                                </div>
                                <script>
                                    $("input[name=mobile]").keyup(function(event){
                                        var mobile = $(this).val();
                                        if (11 == mobile.length && 32 <= event.keyCode) {
                                            $('#vertify_div').css('display','block');
                                        }
                                    });
                                    $("input[name=mobile_vertify]").keyup(function(event){
                                        var mobile_vertify = $(this).val();
                                        if (4 <= mobile_vertify.length && 32 <= event.keyCode) {
                                            send_mobile_code();
                                        }
                                    });
                        
                                    function send_mobile_code() {
                        
                                        var mobile = $("input[name=mobile]").val();
                                        // 手机号是否为空
                                        if (!mobile) {
                                            $("input[name=mobile]").focus();
                                            layer.msg('请输入手机号码！', {time: 1500});
                                            return false;
                                        }
                        
                                        // 手机格式不正确
                                        var reg = /^1[0-9]{10}$/i;
                                        if (!reg.test(mobile)) {
                                            $("input[name=mobile]").focus();
                                            layer.msg('请输入正确的请输入手机号码！', {time: 1500});
                                            return false;
                                        }
                                        $('#vertify_div').css('display','block');
                                        var mobile_vertify = $("input[name=mobile_vertify]").val();
                                        if (!mobile_vertify) {
                                            return false;
                                        }
                        
                                        // 设置为不可点击
                                        $("#mobile_code_button").val('获取中…').attr('disabled', 'disabled');
                                        var __mobile_1_token__ = $('input[name=__mobile_1_token__]').val();
                        
                                        $.ajax({
                                            url: "{eyou:url link='api/Ajax/SendMobileCode' /}",
                                            // source:2 登录
                                            data: {type:'users_mobile_login', mobile:mobile, is_mobile:true, title:'登录', source:2,IsVertify:1, vertify:mobile_vertify, __mobile_1_token__:__mobile_1_token__},
                                            type:'post',
                                            dataType:'json',
                                            success:function(res){
                                                if (res.code == 1) {
                                                    code_countdown();
                                                    layer.msg(res.msg, {time: 1500});
                                                } else {
                                                    $("#mobile_code_button").val('获取验证码').removeAttr("disabled");
                                                    layer.alert(res.msg, {icon: 2, title: false, closeBtn: 0});
                                                }
                                            },
                                            error : function() {
                                                $("#mobile_code_button").val('获取验证码').removeAttr("disabled");
                                                layer.alert('发送失败，请尝试重新发送！', {icon: 5, title: false, closeBtn: 0});
                                            }
                                        });
                                    }
                                    function mobile_fleshVerify(){
                                        var src = "{eyou:url link='api/Ajax/vertify' vars='type=users_mobile_login' /}";
                                        if (src.indexOf('?') > -1) {
                                            src += '&';
                                        } else {
                                            src += '?';
                                        }
                                        src += 'r='+ Math.floor(Math.random()*100);
                                        $('#mobile_imgVerifys').attr('src', src);
                        
                                        $.ajax({
                                            async:false,
                                            url: "__ROOT_DIR__/index.php?m=api&c=Ajax&a=get_token&name=__mobile_1_token__",
                                            data: {_ajax:1},
                                            type:'GET',
                                            dataType:'html',
                                            success:function(res1){
                                                $('input[name=__mobile_1_token__]').val(res1);
                                            },
                                            error : function(e) {
                                                layer.closeAll();
                                                layer.alert(e.responseText, {icon: 5, title:false});
                                            }
                                        });
                                    }
                        
                                    function code_countdown(){
                                        // 倒计时
                                        var setTime;
                                        var time = 120;
                                        setTime = setInterval(function() {
                                            if(0 >= time) {
                                                clearInterval(setTime);
                                                return false;
                                            }
                        
                                            time--;
                                            $("#mobile_code_button").val(time + '秒').attr('disabled', 'disabled');
                                            if(time == 0) $("#mobile_code_button").val('获取验证码').removeAttr("disabled");
                                        }, 1000);
                                    }
                                    function checkMobileUserLogin1649732103() {
                                        var mobile = $('#theMobileForm input[name=mobile]');
                                        var mobile_code = $('#theMobileForm input[name=mobile_code]');
                        
                                        if (mobile.val() == '') {
                                            layer.msg('手机号不能为空！', {
                                                time: 1500
                                            });
                                            mobile.focus();
                                            return false;
                                        }
                        
                                        if (mobile_code.val() == '') {
                                            layer.msg('验证码不能为空！', {
                                                time: 1500
                                            });
                                            mobile_code.focus();
                                            return false;
                                        }
                        
                                        layer_loading('正在处理');
                                        $.ajax({
                                            url: "{eyou:url link='user/Users/mobile_login' /}",
                                            data: $('#theMobileForm').serialize(),
                                            type: 'post',
                                            dataType: 'json',
                                            success: function(res) {
                                                if (1 == res.code) {
                                                    if (5 == res.data.status) {
                                                        layer.alert(res.msg, {
                                                            icon: 5,
                                                            title: false,
                                                            closeBtn: false
                                                        }, function() {
                                                            window.location.href = res.url;
                                                        });
                                                    } else {
                                                        window.location.href = res.url;
                        
                                                    }
                                                } else {
                                                    layer.closeAll();
                                                    if ('vertify' == res.data.status) {
                                                        mobile_fleshVerify();
                                                    }
                        
                                                    if (2 == res.data.status) {
                                                        showErrorAlert(res.msg, 4);
                                                    } else {
                                                        layer.msg(res.msg, {
                                                            icon: 5,
                                                            time: 1500
                                                        });
                                                    }
                                                }
                                            },
                                            error: function(e) {
                                                layer.closeAll();
                                                showErrorAlert(e.responseText);
                                            }
                                        });
                                    }
                                </script>
                            
                                <!-- 第三方账号登录 -->
                                {eyou:include file="/public/static/template/users_v2/users_loginapi_m.htm" /}
                                <!-- 第三方账号登录 -->
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <script>
            //切换账号登录与手机号登录
            $(".tab_list li").click(function(){
                var index = $(this).attr('data-index');
                $(".tab_list li").each(function(){
                    $(this).removeClass('current');
                });
                $(".item").each(function(i,v){
                    if (index == i){
                        $(this).css('display','block');
                    } else{
                        $(this).css('display','none');
                    }
                });
                $(this).addClass('current');

            });

            $(document).keydown(function(event) {
                if (event.keyCode == 13) {
                    var index = $(".tab_list .current").attr('data-index');
                    if (0 == index) {
                        $('input[name=submit]').trigger("click");
                    }else if(1 == index){
                        checkMobileUserLogin1649732103();
                    }
                }
            });


            function fleshVerify() {
                var src = "{eyou:url link='api/Ajax/vertify' vars='type=users_login' /}";
                if (src.indexOf('?') > -1) {
                    src += '&';
                } else {
                    src += '?';
                }
                src += 'r=' + Math.floor(Math.random() * 100);
                $('#imgVerifys').attr('src', src);
            }

            $(function() {
                $('input[name=submit]').on('click', function() {
                    var username = $('input[name=username]');
                    var password = $('input[name=password]');

                    if (username.val() == '') {
                        layer.msg('用户名不能为空！', {
                            time: 1500,
                            icon: 5
                        });
                        username.focus();
                        return false;
                    }

                    if (password.val() == '') {
                        layer.msg('密码不能为空！', {
                            time: 1500,
                            icon: 5
                        });
                        password.focus();
                        return false;
                    }

                    layer_loading('正在处理');
                    $.ajax({
                        // async:false,
                        url: "{eyou:url link='user/Users/login' /}",
                        data: $('#theForm').serialize(),
                        type: 'post',
                        dataType: 'json',
                        success: function(res) {
                            if (1 == res.code) {
                                if (5 == res.data.status) {
                                    layer.alert(res.msg, {
                                        icon: 5,
                                        title: false,
                                        closeBtn: false
                                    }, function() {
                                        window.location.href = res.url;
                                    });
                                    } else {
                                    window.location.href = res.url;
                                }
                                } else {
                                layer.closeAll();
                                if ('vertify' == res.data.status) {
                                    fleshVerify();
                                }

                                if (2 == res.data.status) {
                                    showErrorAlert(res.msg, 4);
                                } else {
                                    layer.msg(res.msg, {
                                        icon: 5,
                                        time: 1500
                                    });
                                }
                            }
                        },
                        error: function(e) {
                            layer.closeAll();
                            showErrorAlert(e.responseText);
                        }
                    });
                });
            });
        </script>
    </body>
</html>
